<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta charset="utf-8" />
<meta name="description" content="Mailbox with some customizations as described in docs" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<%
	String path = request.getContextPath();
	pageContext.setAttribute("path", path);
%>
<link type='text/css' rel='stylesheet' href='${path}/static/myjs/person/css/mui.min.css' /> 
 <link rel="stylesheet" href="${path}/static/myjs/person/css/base.css"/>
    <link rel="stylesheet" href="${path}/static/myjs/person/css/common.css"/>
    <link rel="stylesheet" href="${path}/static/myjs/person/css/page.css"/>
    <script src="${path}/static/myjs/person/js/jquery-1.9.1.min.js"></script>
    <script src="${path}/static/myjs/person/js/mobiscroll_002.js" type="text/javascript"></script>
    <script src="${path}/static/myjs/person/js/mobiscroll_004.js" type="text/javascript"></script>
    <link href="${path}/static/myjs/person/css/mobiscroll_002.css" rel="stylesheet" type="text/css">
    <link href="${path}/static/myjs/person/css/mobiscroll.css" rel="stylesheet" type="text/css">
    <script src="${path}/static/myjs/person/js/mobiscroll.js" type="text/javascript"></script>
    <script src="${path}/static/myjs/person/js/mobiscroll_003.js" type="text/javascript"></script>
    <script src="${path}/static/myjs/person/js/mobiscroll_005.js" type="text/javascript"></script>
    <link href="${path}/static/myjs/person/css/mobiscroll_003.css" rel="stylesheet" type="text/css">
    <script src="${path}/static/myjs/person//js/jqbar.js" type="text/javascript"></script>
    </head>
<body>
<div class="main fr">
    <div class="bar"></div>
    <p class="tishi bdb1">
    <span class="h2-bar"></span>经营统计</p>
    <div class="count-main">
    <c:if test="${businessUser.role.equals('boss') }">
    	<form action="${path }/apiH5/countItem"  method="post" id="dataform">
        <div class="content">
        <input type="hidden"  name="userId"  value="${userId }" />
        	<input type="hidden"  name="token"  value="${token }"/>
            <div class="demos">
                <!--<label for="startTime">开始日期</label>-->
                开始日期：
                <input   value="${pd.startTime }"  readonly name="startTime"  id="startTime" type="text">
            </div>
            <div class="demos">
                <!--<label for="endTime">结束日期</label>-->
                结束日期：
                <input value="${pd.endTime }" class="" readonly name="endTime" id="endTime" type="text">
            </div>
            <div class="demos">
                <button type="button" class="button_foot_yellow" id="subbutton">统计</button>
            </div>

        </div>
        </form>
        <div id="main">
            <div class="apart">
                <div id="today">
                    <div class="icon">
                        <i class="iconfont icon-money"></i>
                    </div>
                    <div class="apart-left">
                        <p>总营收</p>
                        <b>￥</b>
                        <a href="#" id="myBusinessTodayRebate">
                            <i>${pd.totalPrice }</i>
                        </a>
                    </div>
                </div>
                <div id="waiting">
                    <div class="icon">
                        <i class="iconfont icon-dengdai1"></i>
                    </div>
                    <div class="apart-left">
                        <p>订单数量</p>
                        <b></b>
                        <a href="#" id="myBusinessRebate">
                            <i>${pd.orderCount }</i>
                        </a>
                    </div>
                </div>
                <div id="commercial">
                    <div class="icon">
                        <i class="iconfont icon-Shape"></i>
                    </div>
                    <div class="apart-left">
                        <p>配送提成</p>
                        <a href="" id="myBusiness">
                            <i>${pd.sendFee }</i>
                        </a>
                    </div>
                </div>
                <div id="try">
                    <div class="icon">
                        <i class="iconfont icon-shiyong"></i>
                    </div>
                    <div class="apart-left">
                        <p>配送订单数量</p>
                        <a href="#" id="myBusinessOntria">
                            <i>${pd.sendCount }</i>
                        </a>
                    </div>
                </div>
            </div>
        </div>
        </c:if>
        <div id="view" style="background:url(${path}/static/myjs/person/img/bg.png) repeat;background-size:120%;height:fit-content;">
            <div class="viewport" >
                <div class="scroll-content">
                    <h4 class="mui-text-center toptitle" style="color:#fff;font-size:14px;text-align:center;height:40px;line-height:40px">销量排行榜</h4>
                    <ul id="ph-list" class="mui-table-view-chevron">
                    <c:forEach items="${pd.saleFood }"   var="record">
                        <li class="mui-table-view-cell order-phlist">
                        <div class="badge-view-box">
                        <em class="mui-badge mui-badge-danger badge-gray">1</em>
                       </div>
                       <span class="order-phtext">${record.saleName } </span>
                       <div class="in-pt-li">
                       <div id="bar-1" class="jqbar horizontal">
                       		<span class="bar-level-wrapper">
                       			<span class="bar-level" style="height:12px; width: ${(record.saleCount+0.01)/pd.saleFood.get(0).saleCount*300 }px; background-color: rgb(255, 132, 40);"></span>
                       		</span>
                       	</div>
                       </div>
                       <span class="mui-pull-right color-orange mui-h5" style="color:rgb(255, 132, 40);">${record.saleCount }</span>
                       </li>
                     </c:forEach>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
    <script type="text/javascript">
            $(function () {
                var currYear = (new Date()).getFullYear();
                var opt={};
                opt.date = {preset : 'date'};
                opt.datetime = {preset : 'datetime'};
                opt.time = {preset : 'time'};
                opt.default = {
                    theme: 'android-ics light', //皮肤样式
                    display: 'modal', //显示方式
                    mode: 'scroller', //日期选择模式
                    dateFormat: 'yyyy-mm-dd',
                    lang: 'zh',
                    showNow: true,
                    nowText: "今天",
                    startYear: currYear - 70, //开始年份
                    endYear: currYear + 0 //结束年份
                };

                $("#startTime").mobiscroll($.extend(opt['date'], opt['default']));
                $("#endTime").mobiscroll($.extend(opt['date'], opt['default']));
                var optDateTime = $.extend(opt['datetime'], opt['default']);
                var optTime = $.extend(opt['time'], opt['default']);
                $("#startTimeTime").mobiscroll(optDateTime).datetime(optDateTime);
                $("#appTime").mobiscroll(optTime).time(optTime);
            });
 

    $("#subbutton").on("click",function check(){

        var starttime = $('#startTime').val();
        var endtime = $('#endTime').val();

        var sdate = $("#startTime").val();
        var edate = $("#endTime").val();
        if(sdate == ''){
            alert("起始时间不能为空");
            return false;
        }
        if(edate == ''){
            alert("结束时间不能为空");
            return false;
        }

        
        var start = new Date(starttime.replace("-", "/").replace("-", "/"));
        var end = new Date(endtime.replace("-", "/").replace("-", "/"));

        if (end < start) {
            alert('结束日期不能小于开始日期！');
            return false;
        }else {
        	$("#dataform").submit();
        }
    });

            var num = $('.mui-badge');
            for(n=0; n < num.length; n++)
            {
                num.eq(n).text(n+1)
            }

            $("li.order-phlist:eq(0)").find("em.mui-badge").attr("class","mui-badge mui-badge-danger badge-orange");
            $("li.order-phlist:eq(1)").find("em.mui-badge").attr("class","mui-badge mui-badge-danger badge-yellow");
            $("li.order-phlist:eq(2)").find("em.mui-badge").attr("class","mui-badge mui-badge-danger badge-yellow2");
           


    </script>
</body>
</html>